<template>
  <div class="page-box">
    <div class="flex-left">
      <CaiJiAnJianLiang></CaiJiAnJianLiang>
      <!-- <ZhiBanList /> -->
      <!-- <AnJianLeiXingZhanBi></AnJianLeiXingZhanBi> -->
      <ZuiXinAnJian :height="260" :scrollData="scrollData" :servers="0"></ZuiXinAnJian>
    </div>

    <div class="flex-right">
      <SheBeiShuliang />
      <BanLiKaoHe></BanLiKaoHe>
      <!-- <LeiXingChengBanShangShen></LeiXingChengBanShangShen> -->
    </div>
  </div>
</template>

<script>
import CaiJiAnJianLiang from "./components/CaiJiAnJianLiang.vue";
import AnJianChengBanQingKuang from "./components/AnJianChengBanQingKuang.vue";
import AnJianLeiXingZhanBi from "./components/AnJianLeiXingZhanBi.vue";
import BanLiKaoHe from "./components/BanLiKaoHe.vue";
import BenYueAnJianShuLiang from "./components/BenYueAnJianShuLiang.vue";
import LeiXingChengBanShangShen from "./components/LeiXingChengBanShangShen.vue";
import ZuiXinAnJian from "@/components/ZuiXinAnJian/ZuiXinAnJian.vue";
import SheBeiShuliang from "./components/SheBeiShuliang.vue";
import ZhiBanList from "./components/ZhiBanList.vue";
import { VideoListDB } from "@/api";
export default {
  components: {
    CaiJiAnJianLiang,
    AnJianChengBanQingKuang,
    AnJianLeiXingZhanBi,
    BanLiKaoHe,
    BenYueAnJianShuLiang,
    LeiXingChengBanShangShen,
    ZuiXinAnJian,
    SheBeiShuliang,
    ZhiBanList,
  },
  data() {
    return {
      scrollData: [],
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    getData() {
      // 0-首页
      const params = {
        caseType: '事件',
        status: -1,
        isTimeOut: -1,
        orgType: -1,
        orgId: -1,
        pageSize: 999,
        pageNo: 1
      }
      VideoListDB.operationAllPageDB(params).then(res => {
        console.log(res, 'operationAllPageDB')
        if (res.code == 200) {
          let data = []
          res.data.rows.forEach((item) => {
            let obj = {
              ...item,
              img: item.imgSups[0] || '',
              staFrom: '1',
              staLink: '事件处理中',
              sourceTitle: '事件',
              content: item.content || '--'
            }
            data.push(obj)
          })
          this.scrollData = data
          console.log(data)
        }
      })
      return
      this.scrollData = [
        {
          img: "http://image.fancysx.com/order/2299220250330195440.png",
          staLink: "案件处理中", // 没有
          createTime: "2025-03-30 19:54",
          orderNum: "CG1250330195440472",
          sourceTitle: "",  // 没有
          lon: "112.582944360089",
          title: "",
          staFrom: "1",
          content:
            "小店区电子西街与坞城南路交叉口（电子西街）往西80米路北，丁香园门口的车行道上，有大量垃圾桶移位到车行道上，丁香园小区的垃圾桶。",
          lat: "37.751578705462826",
        },
        {
          img: "http://221.204.12.178:8080/eUrbanMIS/mediadl/media/getdata/Media2/rec/20250330/9090585/08a5941a-d4de-4652-ab50-c3a266bb5ac9/20250330183457418104050.jpg",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:45",
          orderNum: "CG1250330184540464",
          sourceTitle: "数字城管",
          lon: "112.62300540271613",
          title: "",
          staFrom: "1",
          content:
            "小店区东润路与许坦东街交叉口（东润路）往北约20米路东，东润路口有露天烧烤",
          lat: "37.80166545968333",
        },
        {
          img: "http://image.fancysx.com/order/2938720250330183840.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:38",
          orderNum: "CG1250330183840641",
          sourceTitle: "数字城管",
          lon: "112.57952372288052",
          title: "",
          staFrom: "1",
          content:
            "禁设区：小店区南内环街与东岗路交叉口（南内环街）西南角、东南角，斑马线上有无照经营游商，卖水果、卖小吃。",
          lat: "37.83893774543286",
        },
        {
          img: "http://image.fancysx.com/order/8537420250330183710.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:37",
          orderNum: "CG1250330183710702",
          sourceTitle: "数字城管",
          lon: "112.55320002811295",
          title: "",
          staFrom: "1",
          content: "小店区平阳路与北园街交叉口东北角，商贩占道经营，请处理。",
          lat: "37.826017913841774",
        },
        {
          img: "http://image.fancysx.com/order/6146520250330183310.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:33",
          orderNum: "CG1250330183310607",
          sourceTitle: "数字城管",
          lon: "112.5794632802183",
          title: "",
          staFrom: "1",
          content:
            "小店区东岗路与体育北街交叉口（东岗路）四个角，斑马线旁天天有无照经营游商，卖水果、卖纸钱、卖小吃。",
          lat: "37.83685975967417",
        },
        {
          img: "",
          staLink: "案件审核中",
          createTime: "2025-03-30 18:32",
          orderNum: "ZF1525033018322761911",
          sourceTitle: "区平台电话",
          lon: "0.0",
          title: "占道经营",
          staFrom: "15",
          content: "晋阳街坞城西路口东南角和西南角北张小区南门对面占道经营",
          lat: "0.0",
        },
        {
          img: "http://image.fancysx.com/order/2872420250330182640.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:26",
          orderNum: "CG1250330182640683",
          sourceTitle: "数字城管",
          lon: "112.57953774500884",
          title: "",
          staFrom: "1",
          content:
            "小店区东岗路与狄村北街交叉口（东岗路）四个角，斑马线上天天有无照经营游商，卖水果、卖菜、卖小吃、卖纸钱等。",
          lat: "37.834102469281184",
        },
        {
          img: "http://image.fancysx.com/order/2885820250330182611.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:26",
          orderNum: "CG1250330182611146",
          sourceTitle: "数字城管",
          lon: "112.58824289237529",
          title: "",
          staFrom: "1",
          content:
            "小店区张家巷与张家巷一条交叉口（张家巷）东北角、西北角、西南角，斑马线旁有无照经营游商，卖水果、卖小吃。",
          lat: "37.830558694384834",
        },
        {
          img: "http://image.fancysx.com/order/1435020250330182600.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:26",
          orderNum: "CG1250330182600104",
          sourceTitle: "数字城管",
          lon: "112.55309509217733",
          title: "",
          staFrom: "1",
          content:
            "小店区平阳路与平阳路东二巷交叉口东南角，东北角，商贩占道经营严重，请处理。",
          lat: "37.828184466536584",
        },
        {
          img: "http://image.fancysx.com/order/4956920250330182550.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:25",
          orderNum: "CG1250330182550632",
          sourceTitle: "数字城管",
          lon: "112.57345494221993",
          title: "",
          staFrom: "1",
          content:
            "小店区富康街与长宁巷交叉口（富康街）往西50米路北，舒家大院门口，污水井盖堵塞满溢。",
          lat: "37.745535020349166",
        },
        {
          img: "http://image.fancysx.com/order/7898620250330182540.png",
          staLink: "案件处理中",
          createTime: "2025-03-30 18:25",
          orderNum: "CG1250330182540944",
          sourceTitle: "数字城管",
          lon: "112.58696977761792",
          title: "",
          staFrom: "1",
          content:
            "小店区建设南路与南十方街交叉口（建设南路）往南50米路东，牛肉火锅门口有违规户外广告。",
          lat: "37.83290065684149",
        },
        {
          img: "http://image.fancysx.com/order/1878620250330182440.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:24",
          orderNum: "CG1250330182440493",
          sourceTitle: "数字城管",
          lon: "112.55323503383147",
          title: "",
          staFrom: "1",
          content:
            "小店区平阳路与平阳路东二巷交叉口往南10米路东，春光荟便民市场门口，商贩占道经营，请处理。",
          lat: "37.82701728967402",
        },
        {
          img: "http://image.fancysx.com/order/1280320250330182410.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:24",
          orderNum: "CG1250330182410433",
          sourceTitle: "数字城管",
          lon: "112.58653675258537",
          title: "",
          staFrom: "1",
          content:
            "禁设区：小店区建设南路与狄村北街交叉口（建设南路）西北角、西南角，斑马线上有无照经营游商，卖纸钱、卖水果。",
          lat: "37.83396470749026",
        },
        {
          img: "http://image.fancysx.com/order/5033820250330182040.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:20",
          orderNum: "CG1250330182040270",
          sourceTitle: "数字城管",
          lon: "112.58697162925569",
          title: "",
          staFrom: "1",
          content:
            "小店区建设南路与张家巷交叉口（建设南路）东北角，果鲜果店外经营。",
          lat: "37.83055773366157",
        },
        {
          img: "http://image.fancysx.com/order/8424820250330181340.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:13",
          orderNum: "CG1250330181340671",
          sourceTitle: "数字城管",
          lon: "112.56888154439743",
          title: "",
          staFrom: "1",
          content:
            "禁设区：小店区体育路与学府街交叉口（体育路）西南角，车行道上不定时有多豪无照经营游商卖水果卖小吃影响交通。",
          lat: "37.80728048138866",
        },
        {
          img: "http://image.fancysx.com/order/2862520250330181310.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:13",
          orderNum: "CG1250330181310603",
          sourceTitle: "数字城管",
          lon: "112.55120136126368",
          title: "",
          staFrom: "1",
          content:
            "尊敬的太原市城管部门领导： 您好！ 我要向您举报一处长期存在且严重影响市容市貌与环境卫生的沾串等小商贩占道经营问题。该地点位于小店区平阳南路近邻商铺门前，每日从下午5时开始，直至晚间22时，大量小商贩在此聚集摆摊。 这些小商贩随意摆放摊位，占据了人行道，行人被迫走上机动车道，造成人车混行，存在极大的交通安全隐患。而且，摊位周边垃圾遍地，酱汁洒落满地、食品袋等垃圾随意丢弃，在炎热天气下散发着难闻气味，严重破坏了周边环境卫生。 在此，恳请城管部门能够重视并尽快处理这一问题，加强对该区域的巡查与监管力度，还居民一个整洁、有序、安全的生活环境。感谢您在百忙之中关注此事！",
          lat: "37.78058413255657",
        },
        {
          img: "http://image.fancysx.com/order/6540620250330181240.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:12",
          orderNum: "CG1250330181240207",
          sourceTitle: "数字城管",
          lon: "112.56889718419228",
          title: "",
          staFrom: "1",
          content:
            "小店区体育路与学府街交叉口（体育路）往南约15米路西，车行道上有露天烧烤。",
          lat: "37.80691475702414",
        },
        {
          img: "http://image.fancysx.com/order/4923720250330180650.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:06",
          orderNum: "CG1250330180650820",
          sourceTitle: "数字城管",
          lon: "112.58655532205911",
          title: "",
          staFrom: "1",
          content:
            "禁设区：小店区建设南路与狄村东街交叉口（建设南路）西南角，路名牌旁有无照经营游商，卖小吃。",
          lat: "37.83059224325187",
        },
        {
          img: "http://image.fancysx.com/order/1792720250330180640.png",
          staLink: "案件完结并上报",
          createTime: "2025-03-30 18:06",
          orderNum: "CG1250330180640244",
          sourceTitle: "数字城管",
          lon: "112.56275446718708",
          title: "",
          staFrom: "1",
          content:
            "禁设区：小店区人民南路与西桥村北街交叉口（人民南路）往南70米路东和路西，地铁口，有卖鸡蛋灌饼的，烤肠的，草莓的无照经营游商",
          lat: "37.70725065839251",
        },
        {
          img: "",
          staLink: "案件处理中",
          createTime: "2025-03-30 18:01",
          orderNum: "XBM2250330180151231_2",
          sourceTitle: "便民热线",
          lon: "",
          title: "蓝海星亲子游泳消费纠纷",
          staFrom: "2",
          content:
            "市民求助：市民于2020年11月在小店区军民路南中环街口“光信国信嘉园”2幢1层1001号“蓝海星亲子游泳(南中环旗舰店)”消费17000元左右报名游泳课（有支付凭证，目前剩余15000元左右），于2025年2月发现该商家已倒闭，联系商家退费不予处理，现希望部门核实，协调退还剩余费用，请核实处理。",
          lat: "",
        },
      ];
    },
  },
};
</script>

<style lang="less" scoped>
.anjianbili {
  // width: 808px;
  width: calc(100% - 531px - 570px);
  // height: auto;
  height: 355px;
  left: 550px;
  // right: 550px;
  bottom: 0;
  // background: url('../../assets/images/layout/middle.png') no-repeat;
  background-image: url("../../assets/images/layout/middle.png");
  background-size: 100% 100% !important;
  // background-size: 100% 100%;

}

:deep(.seamless-warp) {
  height: 450px !important;
}
</style>
